<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title> fadeIn() fadeOut()   </title>
<!-- jQuery library -->
<script src="jquery-1.7.2.min.js"></script>
</head>

<body>



<img src="sample2.jpg" alt="" width="300" height="307" />
<br/>
<button id="fadeOut">fadeOut</button>
<button id="fadeIn">fadeIn</button>

<!---------- jQuery code Start ---------->
<script>
$("body").append("<p></p>");

$('button#fadeOut').click(function() {
   $('img').fadeOut(1000, function() {
    $("p").text('지금 display 값은 '+$(this).css("display")+" 입니다.");
  });
});

$('button#fadeIn').click(function() {
   $('img').fadeIn(1000, function() {
    $("p").text('지금 display 값은 '+$(this).css("display")+" 입니다.");
  });
});

</script>

</body>
</html>
